<div id='contenido_pagina'>
	<!--Start Breadcrumb-->
	<div class="row">
		<div id="breadcrumb" class="col-xs-12">
			<ol class="breadcrumb">
				<li>¡Bienvenido!</li>
			</ol>
		</div>
	</div>
	<!--End Breadcrumb-->

	<div class="box" id="box-config-inicial"> <!-- Inicio box que contiene filtros -->
	    <div class="box-header"> <!-- Inicio titulo del box que contiene filtros -->
	        <div class="box-name collapse-link"><i class="fa fa-cog"></i><span>Configuración Inicial del Sistema</span></div>
	        <div class="box-icons">
	          <a class="collapse-link" title='Ver/Ocultar las configuraciones iniciales del sistema'><i class="fa fa-chevron-down"></i></a>
	        </div>
	    </div> <!-- Fin titulo del box que contiene filtros -->

	    <div id='config-inicial-box-content' class="box-content small" style="display: none;"> <!-- Inicio contenido del box que contiene filtros -->
		    </br>La configuración inicial implica la definición de ciertos valores y parámetros que permiten la puesta a punto del sistema, 
		    paso fundamental a realizarse antes de comenzar a utilizarlo, para lograr el funcionamiento deseado.
		    </br>
		   
		    </br>Este proceso comprende:
		    
		    </br>
		    <h4><i class="fa fa-caret-right"> </i><note>Módulo Usuarios </note></h4>
		    <ul>
		    	<li>Definición de Roles y asignación de permisos.</li>
		    	<li>Creación de cada uno de los usuarios que van a requerir acceso al sistema, asignando el rol correspondiente a cada uno de ellos.</li>
		    </ul>

		    </br>
		    <h4><i class="fa fa-caret-right"> </i><note>Módulo Configuración </note></h4>
		    <ul>
		    	<li>Creación de al menos, una Unidad de Negocio.
			    	<ul>
			    		<li><strong>IMPORTANTE:</strong> Asignación de usuarios a la unidad de negocio. Este paso limita los movimientos que pueden cargar los usuarios únicamente a las unidades a las que pertenecen.</li>
			    		<li>Si se van a utilizar los listados rápidos de Excel, se requiere personalizar de qué manera se desea generarlos.</li>
			    	</ul>
		    	</li>
		    	<li>Si se utilizará la actualización automática de precios por Proveedor, a partir de Listas de Precios en formato Excel, se debe configurar en qué columnas del Excel 
		    	se encuentra la información de interés para la actualización, para cada uno de los proveedores con los que sea de interés utilizar esta funcionalidad.</li>
		    </ul>

		    </br>
		    <h4><i class="fa fa-caret-right"> </i><note>Módulo Productos</note></h4>
		    <ul>
		    	<li>
		    		Cargar los parámetros básicos que serán requeridos al momento de realizar cargas o edición de productos:
		    		<ul>
		    			<li>Depósitos</li>
		    			<li>Rubros</li>
		    			<li>Subrubros</li>
		    			<li>Marcas</li>
		    			<li>Modelos</li>
		    			<li>Colores</li>
		    			<li>Tipos</li>
		    		</ul>
		    	</li>
		    </ul>

		    </br>
		    <h4><i class="fa fa-caret-right"> </i><note>Módulo Clientes</note></h4>
		    <ul>
		    	<li>
		    		Cargar los parámetros básicos que serán requeridos al momento de realizar cargas o edición de clientes:
		    		<ul>
		    			<li>Condiciones de Pago. <strong>IMPORTANTE:</strong> este parámetro es utilizado también para proveedores.</li>
		    		</ul>
		    	</li>
		    </ul>

		    </br>
		    <h4><i class="fa fa-caret-right"> </i><note>Módulo AFIP / Divisas / Ubicación</note></h4>
		    <ul>
		    	<li>Actualizar las tablas con la información obtenida a partir de los datos publicados por AFIP.</li>
		    </ul>
	    </div> <!-- Fin contenido del box que contiene filtros -->
	</div> <!-- Fin box que contiene filtros -->

	<div class="box" id="box-manual-usuario"> <!-- Inicio box que contiene filtros -->
	    <div class="box-header"> <!-- Inicio titulo del box que contiene filtros -->
	        <div class="box-name collapse-link"><i class="fa fa-book"></i><span>Manual Inicial del Usuario</span></div>
	        <div class="box-icons">
	          <a class="collapse-link" title='Ver/Ocultar el manual inicial del usuario'><i class="fa fa-chevron-down"></i></a>
	        </div>
	    </div> <!-- Fin titulo del box que contiene filtros -->

	    <div id='manual-usuario-box-content' class="box-content small"> <!-- Inicio contenido del box que contiene filtros -->
	    	<p align="right">Versión del sistema: 1.05</p>

	    	</br>
		    <h4><i class="fa fa-caret-right"> </i><note>Ingreso</note></h4>
		    <p>Cuando se realiza correctamente el logueo del usuario, éste accede a todas las opciones según sus privilegios y permisos asociados. Esto se ve reflejado en el menú de opciones de la izquierda.
			</br>La pantalla inicial consta de los siguientes componentes:</p>
			<center><img src="<?=base_url()?>manual-usuario/acceso.jpg" width="80%" alt="Pantalla principal y sus componentes"></center>
			</br>Referencias:
			<ol>
				<li><strong>Barra de direcciones</strong>: aquí se coloca la URL del sistema.</li>
				<li>Nombre y logo de la empresa.</li>
				<li><strong>Barra de opciones principal o menú del sistema</strong>: acciones permitidas de acuerdo a los privilegios y permisos del usuario actualmente logueado.</li>
				<li>Icono para mostrar/ocultar la barra de opciones principal.</li>
				<li><strong>Área principal de trabajo</strong>. En esta sección se mostrarán todos los formularios y pantallas de la aplicación. Es donde el usuario realizará la interacción principal con el sistema.</li>
				<li><strong>Menú de opciones del usuario logueado</strong>. Aquí se encuentran las opciones para editar los datos de usuario y cerrar sesión.</li>
			</ol>

			</br>
		    <h4><i class="fa fa-caret-right"> </i><note>Menú del sistema</note></h4>
		    <p>El menú del sistema está conformado por una serie de opciones agrupadas en módulos que permiten acceder a las distintas pantallas, formularios y páginas que conforman la aplicación. Inicialmente todas las opciones se encuentran contraídas y el menú se encuentra visible.
			</br>Para navegar entre las distintas sub-opciones de cada módulo, es suficiente con hacer clic en el nombre de éste para expandirlo, o comprimirlo en caso contrario.</p>
			<center><img src="<?=base_url()?>manual-usuario/menu-sistema.jpg" width="35%" alt="Menú PRODUCTOS expandido y contraído."></center>
			</br><p>Siempre la expansión de un menú, supone que todos los demás se contraigan. Para mostrar/ocultar el menú del sistema, se debe hacer clic sobre el ícono <img src="<?=base_url()?>manual-usuario/icono menu.jpg" alt="Ícono para Mostrar/Ocultar el Menú."></p>

			</br>
		    <h4><i class="fa fa-caret-right"> </i><note>Funcionamiento General</note></h4>
		    <p>A modo de minimizar la curva de aprendizaje del sistema, todos los formularios y páginas tienen una estructura funcional similar que se explica en las próximas secciones.</p>

		    </br>
		    <h5><i class="fa fa-caret-right"> </i><note>Acceder a una página</note></h5>
		    <p>Para acceder a cualquier formulario o página de la aplicación, se debe hacer clic sobre la opción correspondiente en el menú del sistema.
			Por ejemplo, seleccionando la opción Marcas dentro del menú Productos, se vería una pantalla similar a la imagen mostrada a continuación:</p>
			<center><img src="<?=base_url()?>manual-usuario/acceder-pagina.jpg" alt="Acceder a una pantalla particular."></center>
			</br>Referencias:
			<ol>
				<li><strong>Menú del sistema</strong>, desde donde se puede acceder a todas las secciones del sistema habilitadas para el usuario.</li>
				<li>Título de la pantalla.</li>
				<li><strong>Área de búsqueda rápida y filtrado de datos</strong>. Inicialmente se muestra contraída u oculta.</li>
				<li><strong>Área donde se listan los datos</strong> de acuerdo a la entidad elegida. Para el ejemplo, donde se listan todas las marcas registradas en el sistema.</li>
				<li><strong>Botones de navegabilidad</strong>. La lista de datos mostrada se visualiza por secciones para agilizar la carga de la información en el sistema y facilitar la lectura y análisis al usuario. Estos botones permiten navegar entre estas secciones de datos mostradas.</li>
				<li><strong>Botón para crear un nuevo elemento</strong> acorde a la entidad mostrada. Para el ejemplo, crear una nueva Marca en el sistema.</li>
				<li><strong>Ayuda</strong>. Haciendo clic sobre el ícono <img src="<?=base_url()?>manual-usuario/icono-ayuda.jpg" alt="Ícono de ayuda"> se accede a la ayuda particular de la pantalla.</li>
			</ol>

			</br>
		    <h5><i class="fa fa-caret-right"> </i><note>Búsqueda o filtrado de datos</note></h5>
		    <p>En esta área se le permite al usuario filtrar por diferentes opciones (de acuerdo a los datos que existan) o bien, ver un listado completo de la información de la entidad en el sistema.</p>
			<center><img src="<?=base_url()?>manual-usuario/busqueda-filtro.jpg" alt="Opciones para realizar búsquedas o filtrado de datos."></center>
			</br>Referencias:
			<ol>
				<li><strong>Título del área</strong>. Haciendo clic sobre cualquier parte del título, el área se muestra o se oculta según corresponda</li>
				<li><strong>Ícono para mostrar/ocultar el área</strong>. Tiene el mismo funcionamiento que hacer clic sobre la barra de título.</li>
				<li><strong>Campos</strong> donde el usuario puede ingresar información para acotar las búsquedas y filtrar los datos mostrados.</li>
				<li><strong>Botón Filtrar</strong>. De acuerdo a la información ingresada en el punto 3, este botón permite reflejar la información que coincide con dichas entradas.</li>
				<li><strong>Botón Todos</strong>. En este caso se omiten todos los filtros ingresados por el usuario y se muestran todos los resultados.</li>
				<li><strong>Botón Excel</strong>. Si estuviera habilitado, este botón permite exportar a un archivo en formato Excel, el listado de datos que se muestra (fitlrado o no, según si se hayan ingresado datos en los campos de búsqueda).</li>
			</ol>

			</br>
		    <h5><i class="fa fa-caret-right"> </i><note>Listado de datos</note></h5>
		    <p>En esta área se le muestra al usuario el listado de elementos cargados en el sistema. Desde aquí, el usuario podrá realizar acciones de edición, borrado y agregado de información.
			</br>Nota: de acuerdo al tipo de entidad estas acciones se verán restringidas (en algunos casos no se podrán realizar) o bien se le proveerán mayores funcionalidades al usuario.</p>
			<center><img src="<?=base_url()?>manual-usuario/listado-datos.jpg" alt="Listado de datos."></center>
			</br>Referencias:
			<ol>
				<li><strong>Título del área</strong>.</li>
				<li>Ícono para mostrar/ocultar el área <img src="<?=base_url()?>manual-usuario/icono-mostrar-area.jpg" alt="Ícono para mostrar el área."> e ícono para expandir o contraer la tabla de datos <img src="<?=base_url()?>manual-usuario/icono-expandir.jpg" alt="Ícono para expandir la tabla de datos."> (muestra únicamente esta información en la pantalla)</li>
				<li>Detalle de filtros aplicados, si hubiera. Sección informativa.</li>
				<li>Listado de datos.</li>
				<li>Acciones permitidas para realizarse sobre la información. Por ejemplo: editar o borrar el registro actual.</li>
				<li>Botones de navegabilidad.
					</br><center><img src="<?=base_url()?>manual-usuario/navegabilidad.jpg" alt="Botonera de navegabilidad entre los registros."></center>
					De izquierda a derecha: ir a la primera página de resultados, ir a la página anterior, ir a la página siguiente, ir a la última página de resultados.
				</li>
				<li>Botón para crear un nuevo elemento.</li>
			</ol>

			</br>
		    <h5><i class="fa fa-caret-right"> </i><note>Nuevo, Editar o Visualizar elemento</note></h5>
		    <p>Las acciones de los botones <italic>Nuevo, Editar y Ver</italic> son similares en cuanto a su funcionamiento. Al hacer clic sobre ellos despliegan una ventana emergente con el formulario correspondiente. La creación generará un nuevo registro en la base de datos del sistema, la edición modificará los datos previamente cargados y la visualización sólo permite al usuario ver la información cargada.</p>
			<center>
				<img src="<?=base_url()?>manual-usuario/nuevo-elem.jpg" alt="Crear nuevo elemento.">
				</br>Al crear un nuevo elemento, los campos están en blanco.
			</center>
			</br>
			<center>
				<img src="<?=base_url()?>manual-usuario/editar-elem.jpg" alt="Editar datos de un elemento existente.">
				</br>Al editar, se cargan los datos existentes en cada uno de sus correspondientes campos.
			</center>
			</br>Para guardar los datos ingresados se debe presionar el botón Guardar, caso contrario Cancelar.

			</br>
			</br>
		    <h5><i class="fa fa-caret-right"> </i><note>Ingreso de datos</note></h5>
		    <p>Algunos campos tienen un comportamiento especial con el objetivo de facilitarle al usuario la carga de datos al momento de crear nuevos elementos o editar otros existentes.</p>

		    </br>
		    <h6><i class="fa fa-caret-right"> </i><note>Búsqueda con sugerencias</note></h6>
		    <p>Todos los campos que terminan con un ícono de lupa <img src="<?=base_url()?>manual-usuario/icono-lupa.jpg" alt="Ícono de una lupa en el campo de ingreso de texto.">, sugieren alternativas coincidentes con lo que el usuario escribe en él, por ejemplo:</p>
		    </br><center><img src="<?=base_url()?>manual-usuario/busqueda-rapida.jpg" alt="Campo con el comportamiento de búsqueda con sugerencias."></center>
		    </br><center>Cuando el usuario comienza a escribir, a partir de la tercera letra el sistema comienza a sugerir opciones coincidentes con lo ingresado.</center>
		    </br><center><img src="<?=base_url()?>manual-usuario/busqueda-rapida-ingreso.jpg" alt="Sugerencias realizadas por el sistema a partir de los datos ingresados en el campo."></center>
		    </br><center>El usuario debe seleccionar la opción deseada (la información sugerida depende de los datos registrados en el sistema para dicha entidad).</center>
		    </br><center><img src="<?=base_url()?>manual-usuario/busqueda-rapida-seleccion.jpg" alt="Sugerencia elegida."></center>

		    </br>
		    <h6><i class="fa fa-caret-right"> </i><note>Búsqueda dentro de un formulario</note></h6>
		    <p>El otro tipo de búsqueda rápida provista por el sistema, es el siguiente:</p>
		    </br><center><img src="<?=base_url()?>manual-usuario/busqueda-compleja.jpg" alt="Búsqueda rápida a partir de datos o búsqueda compleja."></center>
		    
		    <p>Donde se puede hacer una búsqueda rápida a través del código o nombre de la entidad, o bien acceder a un formulario de búsqueda que permite realizar y combinar distintos filtros.
			</br>La búsqueda rápida o Carga, funciona de la siguiente manera:
			<ol>
				<li>Se ingresa el código o nombre (o parte del código o nombre) en el campo correspondiente.</li>
				<li>Se presiona el botón Cargar.</li>
				<li>La primera coincidencia encontrada (si hubiera) se muestra debajo.</li>
			</ol>
			</p>
			</br><center><img src="<?=base_url()?>manual-usuario/busqueda-compleja-rapida.jpg" alt="Búsqueda rápida a partir de datos."></center>

			<p>Si no se conoce el código o nombre o se desea filtrar por otro criterio, se puede hacer de la siguiente manera:
			<ol>
				<li>Presionar el botón Buscar.</li>
				<li>Aplicar los filtros de búsqueda requeridos.
					</br><center><img src="<?=base_url()?>manual-usuario/busqueda-compleja-busqueda.jpg" alt="Búsqueda compleja a partir de formulario."></center>
				</li>
				<li>Seleccionar la opción deseada, haciendo doble clic sobre el registro o bien presionando el botón <img src="<?=base_url()?>manual-usuario/boton-seleccionar.jpg" alt="Botón para seleccionar el elemento deseado."></li>
				<li>Se muestra el elemento elegido debajo.
					</br><center><img src="<?=base_url()?>manual-usuario/busqueda-compleja-detalle.jpg" alt="Resultado obtenido una vez finalizada correctamente la búsqueda."></center>
				</li>
			</ol>
			</p>

			</br>
		    <h5><i class="fa fa-caret-right"> </i><note>Salir del sistema</note></h5>
		    <p>El usuario podrá cerrar su sesión en el momento que desee, simplemente haciendo clic en el ícono “Bienvenido” (que representa las opciones del usuario) y seleccionando Logout.</p>
		    <center><img src="<?=base_url()?>manual-usuario/cerrar-sesion.jpg" alt="Salir del sistema y cerrar sesión."></center>

	    </div> <!-- Fin contenido del box que contiene filtros -->
	</div> <!-- Fin box que contiene filtros -->

</div>